<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="旅游...">
    <meta name="author" content="作者">
    <meta name="keywords" content="旅游，定制旅游">
    <link rel="stylesheet" href="./css/bootstrap.min.css" type="text/css">
    <title>Document</title>
</head>
<style>
    .nav-pills .nav-link.active {
        background-color: transparent !important;
        border: 1px solid #007BFF !important;
        color: #007BFF !important;
    }
</style>

<body>
    <div class="container-fluid">
        <!-- 导航栏板块 start -->
        <nav class="navbar bg-primary navbar-dark navbar-expand-lg">
            <a href="" class="navbar-brand">插画</a>
            <button class="navbar-toggler" data-toggle="collapse" data-target="#navbarCollapse">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarCollapse">
                <ul class="navbar-nav mr-auto">
                    <li class="nav-item"><a class="nav-link" href="index.html">首页</a></li>
                    <li class="nav-item dropdown">
                        <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">插画选择</a>
                        <div class="dropdown-menu">
                            <a href="tourRoutes.html?region=0" class="dropdown-item">本人设计作品</a>
                            <a href="tourRoutes.html?region=1" class="dropdown-item">他人设计作品</a>
                        </div>
                    </li>
                    <li class="nav-item"><a id="contactLink" data-placement="bottom" data-HTML="true"
                            data-trigger="hover" data-content="<img src='./img/weixin.jpg'>" href="#"
                            class="nav-link">联系我们</a></li>
                </ul>
                <form action="" class="form-inline">
                    <input type="text" class="form-control" placeholder="站内搜索">
                    <button class="btn btn-outline-light ml-3">搜索</button>
                </form>
            </div>
        </nav>
        <!-- 导航栏板块 end -->

        <div class="d-md-flex mt-2">
            <div class="nav text-center d-md-block d-none" style="min-width: 8rem">
                <a href="#huaDong" data-toggle="tab" class="nav-link active">本人设计作品</a>
                <a href="#huaNan" data-toggle="tab" class="nav-link">他人设计作品</a>
            </div>
            <div class="nav nav-pills d-md-none d-block" style="min-width: 8rem">
                <a href="#huaDong" data-toggle="tab" class="nav-link active">本人设计作品</a>
                <a href="#huaNan" data-toggle="tab" class="nav-link">他人设计作品</a>
            </div>
            <div class="tab-content flex-fill">
                <div class="tab-pane active" id="huaDong">
                    <div class="border-bottom border-primary text-primary py-3 pl-3"
                        style="font-size: 1.75rem!important;">
                        <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor"
                            class="bi bi-binoculars-fill" viewBox="0 0 20 20">
                            <path
                                d="M4.5 1A1.5 1.5 0 0 0 3 2.5V3h4v-.5A1.5 1.5 0 0 0 5.5 1h-1zM7 4v1h2V4h4v.882a.5.5 0 0 0 .276.447l.895.447A1.5 1.5 0 0 1 15 7.118V13H9v-1.5a.5.5 0 0 1 .146-.354l.854-.853V9.5a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 0-.5.5v.793l.854.853A.5.5 0 0 1 7 11.5V13H1V7.118a1.5 1.5 0 0 1 .83-1.342l.894-.447A.5.5 0 0 0 3 4.882V4h4zM1 14v.5A1.5 1.5 0 0 0 2.5 16h3A1.5 1.5 0 0 0 7 14.5V14H1zm8 0v.5a1.5 1.5 0 0 0 1.5 1.5h3a1.5 1.5 0 0 0 1.5-1.5V14H9zm4-11H9v-.5A1.5 1.5 0 0 1 10.5 1h1A1.5 1.5 0 0 1 13 2.5V3z" />
                        </svg>
                        <span class="text-muted ml-3">本人设计作品</span>
                    </div>
                    <div class="row mt-2">
                        <div class="col-lg-3 col-md-6 col-sm-12">
                            <div class="card p-3 mb-3 text-decoration-none test-dark">
                                <img src="./img/11.jpg" class="card-img-top" alt="">
                                <div class="card-body">
                                    <h5 class="card-title">aj7</h5>
                                    <p class="card-text">卡片内容文字</p>
                                    <a href="#" class="stretched-link"></a>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-6 col-sm-12">
                            <div class="card p-3 mb-3 text-decoration-none test-dark">
                                <img src="./img/12.jpg" class="card-img-top" alt="">
                                <div class="card-body">
                                    <h5 class="card-title">nike dunk sb</h5>
                                    <p class="card-text">卡片内容文字</p>
                                    <a href="#" class="stretched-link"></a>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-6 col-sm-12">
                            <div class="card p-3 mb-3 text-decoration-none test-dark">
                                <img src="./img/13.jpg" class="card-img-top" alt="">
                                <div class="card-body">
                                    <h5 class="card-title">nike dunk sb</h5>
                                    <p class="card-text">卡片内容文字</p>
                                    <a href="#" class="stretched-link"></a>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-6 col-sm-12">
                            <div class="card p-3 mb-3 text-decoration-none test-dark">
                                <img src="./img/14.jpg" class="card-img-top" alt="">
                                <div class="card-body">
                                    <h5 class="card-title">nike dunk sb</h5>
                                    <p class="card-text">卡片内容文字</p>
                                    <a href="#" class="stretched-link"></a>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-6 col-sm-12">
                            <div class="card p-3 mb-3 text-decoration-none test-dark">
                                <img src="./img/1.jpg" class="card-img-top" alt="">
                                <div class="card-body">
                                    <h5 class="card-title">李宁全城10</h5>
                                    <p class="card-text">卡片内容文字</p>
                                    <a href="#" class="stretched-link"></a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tab-pane active" id="huaNan">
                    <div class="border-bottom border-primary text-primary py-3 pl-3"
                        style="font-size: 1.75rem!important;">
                        <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor"
                            class="bi bi-binoculars-fill" viewBox="0 0 20 20">
                            <path
                                d="M4.5 1A1.5 1.5 0 0 0 3 2.5V3h4v-.5A1.5 1.5 0 0 0 5.5 1h-1zM7 4v1h2V4h4v.882a.5.5 0 0 0 .276.447l.895.447A1.5 1.5 0 0 1 15 7.118V13H9v-1.5a.5.5 0 0 1 .146-.354l.854-.853V9.5a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 0-.5.5v.793l.854.853A.5.5 0 0 1 7 11.5V13H1V7.118a1.5 1.5 0 0 1 .83-1.342l.894-.447A.5.5 0 0 0 3 4.882V4h4zM1 14v.5A1.5 1.5 0 0 0 2.5 16h3A1.5 1.5 0 0 0 7 14.5V14H1zm8 0v.5a1.5 1.5 0 0 0 1.5 1.5h3a1.5 1.5 0 0 0 1.5-1.5V14H9zm4-11H9v-.5A1.5 1.5 0 0 1 10.5 1h1A1.5 1.5 0 0 1 13 2.5V3z" />
                        </svg>
                        <span class="text-muted ml-3">他人设计作品</span>
                    </div>
                    <div class="row mt-2">
                        <div class="col-lg-3 col-md-6 col-sm-12">
                            <div class="card p-3 mb-3 text-decoration-none test-dark">
                                <img src="./img/15.jpg" class="card-img-top" alt="">
                                <div class="card-body">
                                    <h5 class="card-title">nike dunk sb</h5>
                                    <p class="card-text">卡片内容文字</p>
                                    <a href="#" class="stretched-link"></a>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-6 col-sm-12">
                            <div class="card p-3 mb-3 text-decoration-none test-dark">
                                <img src="./img/16.jpg" class="card-img-top" alt="">
                                <div class="card-body">
                                    <h5 class="card-title">李宁全城10</h5>
                                    <p class="card-text">卡片内容文字</p>
                                    <a href="#" class="stretched-link"></a>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-6 col-sm-12">
                            <div class="card p-3 mb-3 text-decoration-none test-dark">
                                <img src="./img/17.jpg" class="card-img-top" alt="">
                                <div class="card-body">
                                    <h5 class="card-title">nike dunk sb</h5>
                                    <p class="card-text">卡片内容文字</p>
                                    <a href="#" class="stretched-link"></a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 页脚版块 start -->
        <footer class="text-right">
            <p>Copyright © 2020 XXXXXXXXXX co., Ltd. All Right Reserved</p>
            <p>深圳XXXXX旅游有限公司 粤ICP备XXXXXXXXXX号</p>
        </footer>
        <!-- 页脚版块 end -->
    </div>

    <script src="./js/jquery-3.6.0.min.js"></script>
    <script src="./js/bootstrap.bundle.min.js"></script>
    <script src="./js/tourSite.menu.js"></script>
</body>

</html>